<template>
    <mescroll-uni top="0"  @down="downCallback" @up="upCallback" :down="downOption" :up="upOption"  class="message" @init="mescrollInit">
        <view class="account-detail common-interval">
            <view class="account-item" v-for="(item, index) in accountDetail" :key="index">
                <view class="title common-flex-between">
                    <text class="name">
                        {{item.fundsLogType === 1 ? '微信支付' : fundsLogType(item.fundsLogType).name}}
                    </text>
                    <text class="total" :style="{'color': fundsLogType(item.fundsLogType).isPay ? '#F82432' : '#089B3F'}">
                       {{fundsLogType(item.fundsLogType).isPay ? '' : '-'}} ¥{{item.fundsLogMoney}}
                    </text>
                </view>
                <view class="method common-flex-between">
                    <text class="common-little-font">{{item.fundsLogType === 1 ? '会员卡购买' : ''}}</text>
                    <text class="common-little-font">{{item.fundsLogAddTime | formatTime}}</text>
                </view>
            </view>
        </view>
    </mescroll-uni>
</template>

<script>
    import service from "@/service";
    import {fundsLogType} from '@/util/mock'
    import { dateFmt } from '@/util/utils';
    export default {
        name: "accountDetail",
        data(){
            return{
                color: '#089B3F',
                fundsLogType: fundsLogType,
                accountDetail: [],
                page: 1,
                limit: 10,
                addlistType: 'list', // 判断是管理列表还是选择地址
                downOption: {
                    auto: false,
                },
                upOption:{
                    use: true, // 是否启用上拉加载; 默认true
                    auto: false, // 是否在初始化完毕之后自动执行上拉加载的回调; 默认true
                    page: {
                        num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
                        size: 10 // 每页数据的数量,默认10
                    },
                    noMoreSize: 5, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
                    empty: {
                        icon: 'https://img.thumbrary.com/empty.png',
                        tip: '暂无数据'
                    },
                    offset: 130,
                    textNoMore:'我是有底线的 >_<'
                },
                mescroll: null
            }
        },
        onLoad(){
            this.getMoneyDetail();
        },
        methods: {
            mescrollInit(mescroll) {
                this.mescroll = mescroll;
            },
            downCallback(mescroll){
                this.accountDetail = [];
                this.page = 1;
                mescroll.resetUpScroll();
            },
            upCallback(mescroll){
                this.page = mescroll.num;
                this.getMoneyDetail();
            },
            getMoneyDetail(){
                uni.showLoading({
                    title: '',
                });
                service.mineService.getMoneyDetail({
                    data: {
                        page: this.page,
                        limit: this.limit
                    },
                    success: res => {
                        uni.hideLoading();
                        if (res.code === 200) {
                            let data = res.result.data || [];
                            this.page > 1 ? this.accountDetail.push(...data) : this.accountDetail = data;
                            this.mescroll && this.mescroll.endBySize(data.length, res.result.num);
                        } else {
                            uni.showToast({
                                title: `${res.resultMsg}`,
                                duration: 2500,
                                icon: 'none'
                            });
                        }
                    },
                    fail: ()=>{
                        uni.hideLoading();
                    },
                    complete: () => {
                    },
                });
            },
        },
        filters: {
            formatTime(value){
                return dateFmt( Number(value+'000'), 'yyyy-MM-dd hh:mm:ss')
            },
        }
    }
</script>

<style scoped lang="scss">
    .account-detail{
        .account-item{
            padding: 18rpx 0;
            border-bottom: 1rpx solid rgba(229,229,229,1);
            .title{
                font-weight:bold;
            }
        }
    }
</style>